<template>
    <div class="table">
        <!-- top -->
        <div class="top">
            <div class="dot"></div>
            <span>今日到期</span>
            <div class="check">查看更多</div>
            <i class="el-icon-arrow-right"></i>
        </div>
        <!-- tabel -->
        <div class="main">
            <el-table class="addClass" :header-cell-style="{ background: 'rgba(81, 123, 255, 0.03)' }" :data="tableList"
                stripe style="width: 100%">
                <el-table-column prop="title" label="投放客户">
                </el-table-column>
                <el-table-column prop="time" label="到期时间">
                </el-table-column>
                <el-table-column prop="name" label="楼盘名称">
                </el-table-column>
                <el-table-column prop="address" label="地址">
                </el-table-column>
            </el-table>
        </div>
    </div>
</template>
<script>
export default {
    components: {

    },
    name: '',
    props: {
        tableList: {
            typeof: Array,
            default: []
        }
    },
    data() {
        return {

        };
    },
    methods: {

    },
    mounted() {

    }
};
</script>
<style scoped>
.table {
    padding-top: 20px;
}

.top {
    display: flex;
    align-items: center;
}

.dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(81, 123, 255, 1);
    margin-right: 8px;
}

.top span {
    flex: 1;
    font-size: 16px;
    font-weight: 500;
    line-height: 23.17px;
    color: rgba(0, 0, 0, 1);
}

.check {
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0px;
    line-height: 23.17px;
    color: rgba(0, 0, 0, 1);
}

.main {
    margin-top: 15px;
    border-radius: 12px;
    overflow: hidden;
    background: rgba(81, 123, 255, 0.03);
    padding: 25px;
}


.addClass .el-table tr {
    background: transparent !important;
}
</style>
